$browser-default-font-size:100;
@function j($px) {
  @return $px / $browser-default-font-size * 1rem / 2;
}
%flexbox{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
%flex{
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
%itemAlignCenter{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  box-align: center;
  -webkit-align-items: center;
  align-items: center;
}
body{ background-color:#fff;}
body,input,button{font-family:"Microsoft Yahei"; outline:none;}

header{
  font-size:j(34); text-align:center; color:#040404; height:j(88); line-height:j(88); border-bottom:j(3) solid #dcdcdc;


}
.reg_wrap{
  max-width:j(640); margin:0 auto;
  h2{
    font-size:j(26); text-align:center; font-weight:normal; margin:j(47) 0;
  }
  section{
    -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
    width:100%; padding:0 j(30);
  }
  .reg_form{
    li{
      margin-bottom:j(50); position:relative;
      @extend %flexbox;
      @extend %itemAlignCenter;
    }
    input{
      width:100%; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
      border:1px solid #d3d3d3; height:j(80); text-indent:j(56); color:#000; font-size:j(32);
      -webkit-border-radius:j(10); -moz-border-radius:j(10); border-radius:j(10); outline:none;
    }
    .warning{
      border-color:#c00;
    }
    .regBtn{
      height:j(82); color:#fff; background-color:#47a14f; border:none;
      -webkit-border-radius:j(10); -moz-border-radius:j(10); border-radius:j(10);
      width:100%; font-size:j(32);
    }
    .get_sms{ width:j(115); height:j(64); -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
      border:1px solid #d3d3d3; -webkit-border-radius:j(15); -moz-border-radius:j(15); border-radius:j(15); font-size:j(32);
      color:#a7a4a4; position:absolute; background-color:#faf6f6; right:j(26); top:j(8);
      -webkit-box-shadow:0 j(2)  j(2) #ccc; -moz-box-shadow:0 j(2)  j(2) #ccc; box-shadow:0 j(2)  j(2) #ccc;
    }
    .address{ background:url(../images/home_icon.jpg) no-repeat j(10) j(27);background-size:j(31) j(27);}
    .mobile{ background:url(../images/mobile_icon.jpg) no-repeat j(15) j(24);background-size:j(23) j(37);}
    .sms{ background:url(../images/lock_icon.jpg) no-repeat j(15) j(24);background-size:j(24) j(31);}
    .verify{ background:url(../images/verify_icon.jpg) no-repeat j(15) j(26);background-size:j(21) j(29); width:j(280);}
    .verify_img{ width:j(76); margin-left:j(30);}
    .change_code{@extend %flex; text-align:right; color:#9a9a9a; font-size:j(14);;}

  }
  .reg_sub{ width:100%; height:auto;}
}
.ui_mask{ position:fixed; width:100%; height:100%; background-color:#000; opacity:0;top:0; left:0; right:0; bottom:0; opacity:0; -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition:all .3s; -o-transition:all .3s; transition:all .3s;
  pointer-events: none;
}
.ui_show {
  opacity: .3;
  pointer-events: auto;
}
.reg_success{
  height:j(202); width:100%; background:#fff; position:fixed; bottom:0; text-align:center;
  font-size:j(32); font-weight:bold; color:#379b40;
  @extend %itemAlignCenter;
  img{
    width:j(77); height:j(74); margin-right:j(20); margin-top:j(-10);

  }
  -webkit-transition:all .3s; -moz-transition:all .3s; -ms-transition:all .3s; -o-transition:all .3s; transition:all .3s;
  -webkit-transform:translateY(100%); -moz-transform:translateY(100%); -ms-transform:translateY(100%); -o-transform:translateY(100%); transform:translateY(100%);
}
.reg_success_show{
  -webkit-transform:translateY(0); -moz-transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); transform:translateY(0);
}